<template>
    <div class="sdy-cate">
        <sdyHeader  back >
            <template #title>
                <van-search @focus="inSearchHandler" shape="round" background="#c72418" placeholder="请输入搜索关键词"/>
            </template>
        </sdyHeader>
        <div class="silde">
            <van-sidebar  v-model="index">
                <van-sidebar-item v-for="item in 30 " :title="'名称'+ item " />
            </van-sidebar>
        </div>
        <div class="content">
            真实内容
        </div>


    
        
    </div>
</template>

<script setup lang="ts">

 import {useRouter, type Router } from 'vue-router'
 import  { ref } from  'vue'
 //
const index = ref<number>(0)



//  vue3 拿  $router ,通过 useRouter  拿到 $router
const $router:Router = useRouter()
const inSearchHandler = () =>{
 
    console.log($router)
    $router.push('/search')
}

</script>



<style scoped lang="scss">

.sdy-cate{
    display: flex;
    height: 100%;

    >.silde{
        width: 80px;
        height:100%;
        overflow-y: auto;

        
        &::-webkit-scrollbar{
            width: 0;
        }
    }


}
</style>